<template>
  <div id="mainBox">
    <banner></banner>
    <banner></banner>

    <el-container>
      <el-main>
    <template>
      <el-select v-model="value" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
    </template>
    <banner></banner>
    <banner></banner>
    <banner></banner>
    <banner></banner>
      </el-main>

    <el-aside width="256px">
      <banner></banner>
    </el-aside>
    </el-container>
  </div>
</template>

<script>
import banner from '../../components/webpage/banner'
export default {
  name: 'mainBox',
  data () {
    return {
      options: [{
        value: '选项1',
        label: '黄金糕'
      }, {
        value: '选项2',
        label: '双皮奶'
      }, {
        value: '选项3',
        label: '蚵仔煎'
      }, {
        value: '选项4',
        label: '龙须面'
      }, {
        value: '选项5',
        label: '北京烤鸭'
      }],
      value: '',
      msg: 'mainBox '
    }
  },
  methods: {
  },
  components: {
    banner
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style >

</style>
